<style>
  .circle {
    width: 100px;
    height: 100px;
    background-color: yellowgreen;
    /* 表示在元素的 （50px, 50px）处，裁剪生成一个半径为 50px 的圆。 */
    clip-path: circle(50px at 50px 50px)
  }

  .polygon {
    width: 100px;
    height: 100px;
    background-color: yellowgreen;
    /* 图形就是依次连接这 10 个坐标点形成一个裁切图形 */
    clip-path: polygon(50% 0%, 80% 10%, 100% 35%, 100% 70%, 80% 90%, 50% 100%, 20% 90%, 0% 70%, 0% 35%, 20% 10%);

  }
</style>

<div class="circle"></div>
<div class="polygon"></div>